<template>
<div>
    <el-row class="tac">
        <el-col :span="24">
            <el-menu
                    default-active="/vip/info"
                    class="el-menu-vertical-demo"
                    @open="handleOpen"
                    @close="handleClose"
                    router="true"
            >

                    <el-menu-item index="/vip/info">
                        <el-icon><House /></el-icon>
                        <span>首页信息</span>
                    </el-menu-item>
<!--                        子路由-->
                    <el-sub-menu index="/">
                        <template #title>
                            <el-icon><Menu /></el-icon>
                            <span>航班管理</span>
                        </template>
<!--                            flight-->
                        <el-menu-item index="/vip/flight">
                            <el-icon><Promotion /></el-icon>
                            <span>航班飞机信息</span>
                        </el-menu-item>
                        <el-menu-item index="/vip/flightDate">
                            <el-icon><Calendar/></el-icon>
                            <span>航班时间信息</span>
                        </el-menu-item>
                        <el-menu-item index="/vip/airPort">
                            <el-icon><Place /></el-icon>
                            <span>航班机场信息</span>
                        </el-menu-item>
                    </el-sub-menu>
                <el-sub-menu index="/a">
                    <template #title>
                        <el-icon><Operation /></el-icon>
                        <span>航班变更管理</span>
                    </template>
                    <!--                            flight-->
                    <el-menu-item index="/vip/hbUpdate">
                        <el-icon><Refresh /></el-icon>
                        <span>航班航线变更</span>
                    </el-menu-item>
                    <el-menu-item index="/vip/updateHistory">
                        <el-icon><FolderOpened /></el-icon>
                        <span>航班航线变更历史</span>
                    </el-menu-item>

                </el-sub-menu>
                    <el-menu-item index="/vip/bag">
                        <el-icon><Box /></el-icon>
                        <span>行李转盘管理</span>
                    </el-menu-item>

                    <el-menu-item index="/vip/gate" >
                        <el-icon><Location /></el-icon>
                        <span>登机口管理</span>
                    </el-menu-item>
                <el-menu-item index="/vip/flightDelay" >
                    <el-icon><PieChart /></el-icon>
                    <span>航班起降架次统计</span>
                </el-menu-item>
                    <el-menu-item index="/vip/user" >
                        <el-icon><User /></el-icon>
                        <span>账号管理</span>
                    </el-menu-item>
                    <el-menu-item index="#" disabled>
                        <span></span>
                    </el-menu-item>
                    <el-menu-item index="#" disabled>
                        <span></span>
                    </el-menu-item>
                    <el-menu-item index="#" disabled>
                        <span></span>
                    </el-menu-item>
            </el-menu>
        </el-col>
    </el-row>
</div>
</template>
<script lang="ts"  setup>
    import {
        Document,
        Menu as IconMenu,
        Location,
        Setting,
        House,
        Box,
        Promotion,
        Calendar,
        Tickets,
        User,
        Menu,
        MapLocation,
        Operation,
        Refresh,
        FolderOpened,
        PieChart,
        Place,
    } from '@element-plus/icons-vue'
    import {ref} from "vue";
    const handleOpen = (key: string, keyPath: string[]) => {
        // console.log(key, keyPath)
    }
    const handleClose = (key: string, keyPath: string[]) => {
        // console.log(key, keyPath)
    }
</script>
<style scoped>
</style>